import 'package:flutter/material.dart';
import 'package:flutter_widget/custom/custom_appbar.dart';

// ignore: must_be_immutable
class TablePage extends StatefulWidget {
  String name;
  TablePage({Key? key, required this.name}) : super(key: key);

  @override
  // ignore: no_logic_in_create_state
  _TablePageState createState() => _TablePageState();
}

class _TablePageState extends State<TablePage> {
  // ignore: deprecated_member_use
  List<Map> list = [];
  bool _sortAscending = true;
  int _sortColumnIndex = 0;
  @override
  void initState() {
    for (var i = 1; i < 6; i++) {
      list.add({
        "name": ("庆鹏" + i.toString()) * i,
        "gender": i % 2 == 0 ? "男" : "女",
        'select': true,
        "age": i
      });
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppbar(widget.name, Theme.of(context).primaryColor),
      body: Center(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.all(10),
              child: Table(
                border: TableBorder.all(width: 2, color: Colors.grey),
                children: list
                    .map(
                      (e) => TableRow(
                        children: [
                          Text(
                            e['name'],
                          ),
                          Text(
                            e['gender'],
                          ),
                          Text(
                            e['age'].toString(),
                          ),
                        ],
                      ),
                    )
                    .toList(),
              ),
            ),
            Padding(
              padding: const EdgeInsets.all(10),
              child: DataTable(
                sortAscending: _sortAscending,
                sortColumnIndex: _sortColumnIndex,
                onSelectAll: (v) {
                  for (var i = 0; i < list.length; i++) {
                    setState(() {
                      if (list[i]['select'] != v) {
                        list[i]['select'] = v;
                      }
                    });
                  }
                },
                columns: [
                  DataColumn(
                    label: const Text('姓名'),
                    // onSort: (sortColumnIndex, sortAscending) {
                    //   setState(
                    //     () {
                    //       _sortAscending = sortAscending;
                    //       _sortColumnIndex = sortColumnIndex;
                    //       list.sort((a, b) {
                    //         if (!sortAscending) {
                    //           var c = a;
                    //           a = b;
                    //           b = c;
                    //         }
                    //         return a['name']
                    //             .toString()
                    //             .length
                    //             .compareTo(b['name'].toString().length);
                    //       });
                    //     },
                    //   );
                    // },
                  ),
                  const DataColumn(
                    label: Text('性别'),
                  ),
                  DataColumn(
                      label: const Text('年龄'),
                      onSort: (sortColumnIndex, sortAscending) {
                        setState(() {
                          _sortAscending = sortAscending;
                          _sortColumnIndex = sortColumnIndex;
                          list.sort((a, b) {
                            if (!sortAscending) {
                              var c = a;
                              a = b;
                              b = c;
                            }
                            return a['age'].compareTo(b['age']);
                          });
                        });
                      }),
                ],
                rows: list
                    .map(
                      (e) => DataRow(
                        selected: e['select'],
                        onSelectChanged: (v) {
                          setState(() {
                            if (e['select'] != v) {
                              e['select'] = v;
                            }
                          });
                        },
                        cells: [
                          DataCell(
                            Text(
                              e['name'],
                            ),
                          ),
                          DataCell(
                            Text(
                              e['gender'],
                            ),
                          ),
                          DataCell(
                            Text(
                              e['age'].toString(),
                            ),
                          ),
                        ],
                      ),
                    )
                    .toList(),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
